<?php
use yii\helpers\Url;

?>
<link href="/backend/css/new-business.css" rel="stylesheet">
<!-- 引入 echarts.js -->
<?= $this->render('../_nav'); ?>
<style>
    @media (min-width: 992px) and (max-width: 1440px){
        .list-box>dl.table-tr{
            display: -webkit-box;
            display: -moz-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
        }
        .list-box>dl>dt,
        .list-box>dl>dd{
            width: auto;
            -webkit-box-flex: 1;
            -moz-box-flex: 1;
            -webkit-flex: 1;
            -ms-flex: 1;
            flex: 1;
        }
    }
</style>
<section class="container" style="padding-top:10px;">

    <div id="myTabContent" class="tab-content">
        <!--  business noe     -->
        <div class="tab-row">
            <?= $this->render('../_financial_data'); ?>
            <div class="tab-row-tow" id="tab-row-tow">
                <!--   营业收入       -->
                <a href="<?= Url::toRoute(['financial/cashier', 'action' => 'saleamount', 'searchTime' => Yii::$app->request->get()['searchTime'], 'start_time' => Yii::$app->request->get()['start_time'],  'end_time' => Yii::$app->request->get()['end_time']]) ?>">
                    <div class="ml0 tab-row-box current fl">
                        <div class="tab-box-icon current">
                            <img src="/backend/img/financial/income_ico.png" class="">
                            <img src="/backend/img/financial/income_ico1.png" class="d-none">
                        </div>
                        <div class="tab-box-text current">
                            <span style="font-size: 16px;">营业收入<em style="color: #c3a279">￥<?php echo $consumeList[0]['consume_amount'] ? $consumeList[0]['consume_amount'] : '0.00'; ?>元</em></span>
                            <span style="font-size: 12px;">现金:<em style="color: #fe7b9d">￥<?php echo $consumeList[0]['cash_pay'] ? $consumeList[0]['cash_pay'] : '0.00'; ?>元</em></span>
                            <span style="font-size: 12px;">刷卡:<em style="color: #fe7b9d">￥<?php echo $consumeList[0]['unionpay'] ? $consumeList[0]['unionpay'] : '0.00'; ?>元</em> </span>
                        </div>
                    </div>
                </a>
                <!--   到店会员       -->
                <a href="<?= Url::toRoute(['financial/cashier', 'action' => 'one', 'searchTime' => Yii::$app->request->get()['searchTime'], 'start_time' => Yii::$app->request->get()['start_time'],  'end_time' => Yii::$app->request->get()['end_time']]) ?>">
                    <div class="tab-row-box fl">
                        <div class="tab-box-icon y">
                            <img src="/backend/img/financial/store_ico.png" class="d-none">
                            <img src="/backend/img/financial/store_ico1.png" class="">
                        </div>
                        <div class="tab-box-text ">
                            <span style="font-size: 16px;">到店会员：<em style="color: #c3a279"><?php echo $come_member; ?></em></span>
                            <span style="font-size: 13px;">新增会员：<em style="color: #c3a279"><?php echo $bus_members[0]['member_id']; ?></em> </span>
                        </div>
                    </div>
                </a>
                <!--   消化金额       -->
                <a href="<?= Url::toRoute(['financial/cashier', 'action' => 'two', 'searchTime' => Yii::$app->request->get()['searchTime'], 'start_time' => Yii::$app->request->get()['start_time'],  'end_time' => Yii::$app->request->get()['end_time']]) ?>">
                    <div class="tab-row-box  fl">
                        <div class="tab-box-icon z">
                            <img src="/backend/img/financial/consume_ico.png" class="d-none">
                            <img src="/backend/img/financial/consume_ico1.png" class="">
                        </div>
                        <div class="tab-box-text ">
                            <span style="font-size: 16px;">消耗金额</span>
                            <span style="font-size: 13px;"><em style="color: #c3a279">￥<?php if(!empty($bus_service_extends[0]['consume_amount'])) { echo  $bus_service_extends[0]['consume_amount']; }else{ echo '0.00';} ?>
                                元</em></span>
                        </div>
                    </div>
                </a>
                <!--   手工提成       -->
                <a href="<?= Url::toRoute(['financial/cashier', 'action' => 'three', 'searchTime' => Yii::$app->request->get()['searchTime'], 'start_time' => Yii::$app->request->get()['start_time'], 'end_time' => Yii::$app->request->get()['end_time']]) ?>">
                <div class="tab-row-box  fl">
                        <div class="tab-box-icon l ">
                            <img src="/backend/img/financial/manual_ico.png" class="d-none">
                            <img src="/backend/img/financial/manual_ico1.png" class="">
                        </div>
                        <div class="tab-box-text ">
                            <span style="font-size: 16px;">手工提成</span>
                            <span><em style="color: #c3a279">￥<?php if(!empty($sum_handwork_reward[0]['handwork_reward'])) { echo  $sum_handwork_reward[0]['handwork_reward']; }else{ echo '0.00';} ?>元</em></span>
                        </div>
                    </div>
                </a>
            </div>
        </div>
        <!--  business tow      -->
        <div class="clearfix"></div>
        <div class="tab-list">
            <!--  business-list one   -->
            <div class="tab-list-box">
                <div class="title">
                    <span>营业收入</span>
                </div>
                <div class="list-box fl">
                    <dl class="table-tr table-title-ft">
                        <dt>营收项目</dt>
                        <dd>金额</dd>
                        <dd>占比</dd>
                    </dl>
                    <dl class="table-tr table-mes-ft">
                        <dt>疗程卡</dt>
                        <dd>
                            ￥<?php echo !empty($finance_type1[0]['total_price']) ? $finance_type1[0]['total_price'] : '0.00'; ?></dd>
                        <dd><?php echo round($finance_type1[0]['total_price'] / ($finance_type1[0]['total_price'] + $finance_type2[0]['total_price'] + $finance_type4[0]['total_price'] + $finance_type5[0]['total_price']), 2) * 100 . '%'; ?></dd>
                    </dl>
                    <dl class="table-tr table-mes-ft">
                        <dt>家居产品</dt>
                        <dd>
                            ￥<?php echo !empty($finance_type2[0]['total_price']) ? $finance_type2[0]['total_price'] : '0.00'; ?></dd>
                        <dd><?php echo round($finance_type2[0]['total_price'] / ($finance_type1[0]['total_price'] + $finance_type2[0]['total_price'] + $finance_type4[0]['total_price'] + $finance_type5[0]['total_price']), 2) * 100 . '%'; ?></dd>
                    </dl>
                    <dl class="table-tr table-mes-ft">
                        <dt>服务项目</dt>
                        <dd>
                            ￥<?php echo !empty($finance_type5[0]['total_price']) ? $finance_type5[0]['total_price'] : '0.00'; ?></dd>
                        <dd><?php echo round($finance_type5[0]['total_price'] / ($finance_type1[0]['total_price'] + $finance_type2[0]['total_price'] + $finance_type4[0]['total_price'] + $finance_type5[0]['total_price']), 2) * 100 . '%'; ?></dd>
                    </dl>
                    <dl class="b-none table-tr table-mes-ft">
                        <dt>合作项目</dt>
                        <dd>
                            ￥<?php echo !empty($finance_type4[0]['total_price']) ? $finance_type4[0]['total_price'] : '0.00'; ?></dd>
                        <dd><?php echo round($finance_type4[0]['total_price'] / ($finance_type1[0]['total_price'] + $finance_type2[0]['total_price'] + $finance_type4[0]['total_price'] + $finance_type5[0]['total_price']), 2) * 100 . '%'; ?></dd>
                    </dl>
                </div>
                <div class="list-box fr b-none">
                    <div id="main" style="width:100%;height:260px;"></div>
                </div>
            </div>
            <div class="clearfix"></div>
            <!--  business-list public   -->
            <div class="tab-list-box">
                <div class="title">
                    <!--                    <span>营业收入</span>-->
                </div>
                <div class="b-none">
                    <div id="main1" style="height:280px; border: 1px solid #dedede;  margin-top: 20px;"></div>
                </div>

            </div>

        </div>
</section>

<?php $this->registerJsFile("@web/libs/echarts/echarts.js", ['position' => $this::POS_HEAD]); ?>
<script>
    // 基于准备好的dom，初始化echarts实例
    var myChart = echarts.init(document.getElementById('main'));

    var  total_price =  <?php echo round($finance_type5[0]['total_price']);?>,
        total_price1 =  <?php echo round($finance_type4[0]['total_price']);?>,
        total_price2 =  <?php echo round($finance_type2[0]['total_price']);?>,
        total_price3 =  <?php echo round($finance_type1[0]['total_price']);?>;



    // 指定图表的配置项和数据
    option = {
        title: {},
        tooltip: {
            trigger: 'item',
            formatter: "{d}%"
        },
        legend: {},
        textStyle:{
            color:'#6f6f6f',
        },
        series: [
            {
                name: '访问来源',
                type: 'pie',
                radius : ['40%', '65%'],
                center: ['50%', '50%'],
                data: [
                    {
                        value:total_price,
                        name: '服务项目(￥'+total_price.toFixed(2)+')',
                    },
                    {
                        value:total_price1,
                        name: '合作项目(￥'+total_price1.toFixed(2)+')',
                    },
                    {
                        value:total_price2,
                        name: '家居产品(￥'+total_price2.toFixed(2)+')',
                    },
                    {
                        value:total_price3,
                        name: '疗程卡(￥'+total_price3.toFixed(2)+')',
                    },
                ],
                color: [
                    '#ffbe57',
                    '#ff8e67',
                    '#fe6b75',
                    '#ff5792',
                ],
                itemStyle: {
                    emphasis: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
        ]
    };

    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
    // 基于准备好的dom，初始化echarts实例
    var myChart = echarts.init(document.getElementById('main1'));
    var  consumeList = <?php echo !empty($consumeList[0]['consume_amount']) ? $consumeList[0]['consume_amount'] : '0.00';?>,
         bus_service_extends =  <?php echo !empty($bus_service_extends[0]['consume_amount']) ? $bus_service_extends[0]['consume_amount'] : '0.00';?>,
         give_pay =  <?php echo !empty($consumeList[0]['give_pay']) ? $consumeList[0]['give_pay'] : '0.00';?>,
         balance_pay = <?php echo !empty($consumeList[0]['balance_pay']) ? $consumeList[0]['balance_pay'] : '0.00';?>,
    // 指定图表的配置项和数据
    option = {
        title: {},
        tooltip: {
            showContent:false,
        },
        legend: {},
        grid: {
            width: '85%',
            left: 80,
            containLabel: false,
        },
        xAxis: {
            name: '营收类型',
            data: [
                " 营业收入", "消耗金额", "扣赠金额" ,"卡扣金额", {
                    textStyle:{
                        color:'#6f6f6f',
                    }
                }
            ],
            splitLine: {
                show: false
            },
            nameTextStyle: {
                color:'#6f6f6f' ,
                fontSize:'12px',
            },
            nameGap:'25',
            axisLine: {
                show:false,
                lineStyle: {
                    color: '#e5e5e5'
                }
            },
            axisTick: {
                show: false
            },
        },
        yAxis: {
            name: '金额',
            type: 'value',
            min: 0,
            nameTextStyle: {
                color:'#6f6f6f' ,
                fontSize:'12px',
            },
            nameGap:'25',
            axisLine: {
                show: false,
                lineStyle: {
                    color: '#e5e5e5'
                }
            },
            axisTick: {
                show: false
            },
            splitLine: {
                lineStyle:{
                    type:'dashed'
                }
            }
        },
        series: [{
            name: '销量',
            type: 'bar',
            barMinHeight:5,
            barWidth: 80,
            barMaxWidth:80,
            label: {
                normal: {
                    show: true,
                    formatter: '￥{c}',
                    position: 'top',
                    textStyle:{
                        color:'#6f6f6f',
                    }
                }
            },
            itemStyle: {
                normal: {
                    show:false,
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 0.8, [{
                        offset: 0,
                        color: '#f78ca8'
                    }, {
                        offset: 1,
                        color: '#fce5a2'
                    }])
                }
            },
            data: [
                {
                    value:consumeList,
                    name: '营业收入(20%)',
                },
                {
                    value:bus_service_extends,
                    name: '消耗金额(<?php echo round($bus_service_extends[0]['consume_amount']/($consumeList[0]['consume_amount'] + $bus_service_extends[0]['consume_amount'] + $consumeList[0]['give_pay'] + $consumeList[0]['balance_pay']), 2)*100 . '%';?>)',
                },
                {
                    value:give_pay,
                    name: '扣赠金额(<?php echo round($consumeList[0]['give_pay']/($consumeList[0]['consume_amount'] + $bus_service_extends[0]['consume_amount'] + $consumeList[0]['give_pay'] + $consumeList[0]['balance_pay']), 2)*100 . '%';?>)',
                },
                {
                    value:balance_pay,
                    name: '卡扣金额(<?php echo round($consumeList[0]['balance_pay']/($consumeList[0]['consume_amount'] + $bus_service_extends[0]['consume_amount'] + $consumeList[0]['give_pay'] + $consumeList[0]['balance_pay']), 2)*100 . '%';?>)',
                },
            ]
        }]
    };
    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);

    $(function () {
        laydate.skin('meelier');
        $('.table tr td').dblclick(function () {
            $(this).find('input').removeAttr("readonly").addClass('read');
            if (typeof($(this).find('input').attr('readonly')) == "undefined") {
                if ($(this).find('a').length < 1) {
                    //$(this).append('<a class="ok edit" href="#">确定</a>');
                    $(this).parent().find('.fadeBox').show();
                    $(this).parent().find('.del').hide();
                }
            }

            $('.ok').click(function () {
                $(this).parent().find('input').attr('readonly', true).removeClass('read');
                $(this).parent().parent().find('.fadeBox').hide();
                $(this).parent().parent().find('.del').show();
                $(this).remove();
            })
            $('.rest').click(function () {
                $(this).parent().hide();
                $(this).parent().parent().find('.del').show();
                $(this).parent().parent().parent().find('input').attr('readonly', true).removeClass('read');
                $(this).parent().parent().parent().find('.ok').remove();
            })
        })

        $('.add-recharge').click(function (e) {
            e.preventDefault();
            $(this).next().find('tbody').append('<tr><form id="test" method="post" role="form" action="<?=Url::toRoute('config/add')?>"><td><input class="read" type="text"/></td><td><input class="read" type="text"/></td><td><input name="_csrf" type="hidden" id="_csrf" value="<?= Yii::$app->request->csrfToken ?>"><input type="submit" value="保存" class="edit" /></a><a href="#" class="edit restb" style="margin-left: 5px;">取消</a></td></form></tr>');

            $('.restb').click(function () {
                $(this).parent().parent().remove();
            })
        })
    })
</script>
